<template>
	<view class="purchase-list">
		<my-tabs @change="tapChange" :modelData="modelData" :initIndex="initIndex"></my-tabs>
		<scroll-view
			class="purchase-body"
			scroll-y="true"
			@scrolltolower="scrolltolower"
			@scrolltoupper="scrolltoupper"
			@scroll="scroll"
			@touchstart="touchstart"
			@touchend="touchend"
		>
			<view class="my-unit">
				<view class="item selected">
					<text @click="selectAll">
						<checkbox name="checkbox" value="全选" />
						全选
					</text>
					<button size="mini" class="fr btn" type="primary" @click="examine_pass_batch()">批量审核</button>
				</view>
				<view class="item" v-for="(item, index) in data" :key="index">
					<view class="unit-head">
						<checkbox :value="String(item.id)" :checked="item.selected" />
						<text>讲座：{{ item.title }}</text>
						<br />
					</view>
					<view class="unit-body" @click="goToDetail(item.id)">
						<view class="realname">
							{{ item.info.name }}
							<text v-if="item.status == 1" class="fr danger">{{ get_examine(item.status).label }}</text>
							<text v-else class="fr success">{{ get_examine(item.status).label }}</text>
						</view>
						<br />
						{{ item.info.idcard }}
						<br />
						{{ item.info.phone }}
						<br />
					</view>
					<view class="unit-foot">
						<button v-if="((item.status == 1 || item.status == 2) && is_manage == 1) || is_manage == 2" class="fr btn success" type="" @click="change_money(item.id)">
							修改金额
						</button>
						<button v-if="item.status == 1 || (item.status == 2 && is_manage == 2)" class="fr btn" type="primary" @click="examine_pass(item.id)">审核通过</button>
						<button v-if="item.status == 2 || (item.status == 3 && is_manage == 2)" class="fr btn" type="warn" @click="examine_fail(item.id)">取消审核</button>
					</view>
				</view>
				<view v-if="isShow" class="toBottom">已经到底了~~</view>
				<view class="total">共计{{ page.total }}条</view>
			</view>
		</scroll-view>
		<my-loading></my-loading>

		<uni-popup ref="dialogInput" type="dialog" @change="change">
			<uni-popup-dialog mode="input" title="修改金额" value="" placeholder="请输入金额" @confirm="dialogInputConfirm"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>
<script>
import myTabs from '@/components/myTabs/myTabs.vue';
import myPull from '@/static/js/myPull.js';
import myLoading from '@/components/myLoading/myLoading.vue';
import { mapGetters, mapActions } from 'vuex';
import { get, post, showToast } from '@/static/utils/index';
import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue';
export default {
	components: { myTabs, myLoading, uniPopupDialog },
	data() {
		return {
			modelData: [{ label: '待审核', value: 1 }, { label: '审核通过', value: 2 }],
			status: [{ label: '待审核', value: 1 }, { label: '业务员审核通过', value: 2 }, { label: '管理员审核通过', value: 3 }],
			page: { page_no: 1, page_size: 10, total: 0 },
			data: [],
			search: {
				status: 1,
				manager_id: 0
			},
			isShow: false,
			is_manage: 1,
			id: 0,
			chooseAll: false
		};
	},
	computed: {
		// ...mapGetters( '',['hasLogin'])
	},

	created() {
		this.search.manager_id = localStorage.getItem('manager_id');
		this.is_manage = localStorage.getItem('is_manage');
		if (!this.search.manager_id) {
			uni.navigateTo({
				url: `/pages/login/login`
			});
		}
		this.getList();
	},
	methods: {
		//批量审核
		examine_pass_batch(){
			let ids = [];
			for(var i=0 ;i<this.data.length;i++){
				if(this.data[i]['selected']){
					ids.push(this.data[i]['id']);
				}
			}
			this.$store.dispatch('examinePass', Object.assign({ id: ids }, this.search)).then(res => {
				showToast(res.msg);
				this.data = [];
				this.page.page_no=1;
				this.getList();
			});
		},
		//全选
		selectAll() {
			if (this.chooseAll) {
				for (var i = 0; i < this.data.length; i++) {
					this.data[i]['selected'] = false;
				}
			} else {
				for (var i = 0; i < this.data.length; i++) {
					this.data[i]['selected'] = true;
				}
			}
			this.chooseAll = !this.chooseAll;
		},
		goToDetail(id) {
			uni.navigateTo({
				url: `/pages/info/detail?id=${id}`
			});
		},
		change_money(id) {
			this.id = id;
			this.$refs.dialogInput.open();
		},
		change(e) {},
		dialogInputConfirm(done, val) {
			this.$store.dispatch('changeMoney', Object.assign({ id: this.id, money: val }, this.search)).then(res => {
				showToast(res.msg);
			});
			uni.hideLoading();
			// 关闭窗口后，恢复默认内容
			done();
		},
		examine_fail(id) {
			this.$store.dispatch('examineFail', Object.assign({ id: id }, this.search)).then(res => {
				showToast(res.msg);
			});
		},
		examine_pass(id) {
			this.$store.dispatch('examinePass', Object.assign({ id: id }, this.search)).then(res => {
				showToast(res.msg);
			});
		},
		get_examine(status) {
			const examine = this.status.find(item => item.value == status);
			return examine || { value: -2, label: '未知' };
		},
		/**
		 * @name 获取列表
		 */

		getList() {
			this.$store.dispatch('getLectureInfo', Object.assign(this.page, this.search)).then(res => {
				if (res.code == 200) {
					this.data = [...this.data, ...res.data.data];
					if (res.data.data.length == 0) {
						this.isShow = true;
					}
					this.page.total = res.data.total;
				} else if (res.code == 204) {
					uni.navigateTo({
						url: `/pages/login/login`
					});
				} else {
					showToast(res.message);
				}
			});
		},

		/**
		 * @name 触底加载
		 */
		scrolltolower(event) {
			this.page.page_no = this.page.page_no + 1;

			this.getList();
		},

		scroll(e) {
			// 重新设置pulldown

			this.setPullDown(e.detail.scrollTop < 10);
		},

		scrolltoupper() {},

		/**
		 * @name 改变tab
		 * @param val 索引
		 */
		tapChange(val) {
			this.initIndex = val;
			// this.search.status = this.modelData[val]['value'];
			// this.data = [];
			// this.getList();
		}
	},
	watch: {
		initIndex(val, oldVal) {
			//普通的watch监听
			this.search.status = this.modelData[val]['value'];
			this.page.page_no = 1;
			this.data = [];
			this.getList();
		}
	},
	mixins: [myPull({})]
};
</script>
<style lang="scss">
.purchase-list {
	background-color: #f5f5f5;
	height: 100vh;
	overflow: hidden;

	.purchase-body {
		height: calc(100% - 88upx);
		overflow: auto;
	}
}
.my-unit {
	margin: 10upx 0;

	font-size: 28upx;
	transform: all 1s;
	.selected {
		padding: 20upx;
		line-height: 60upx;
	}
	.fr {
		float: right;
	}
	.item {
		margin: 20upx;
		border-radius: 10upx;
		background-color: #ffffff;
		box-shadow: 0px 2px 5px #9f9f9f;
	}

	.unit-head {
		padding: 20upx;
		// height: 104upx;
		// line-height: 64upx;
		box-sizing: border-box;
		border-bottom: 2upx solid #f5f5f5;
		.fr {
			float: unset;
		}
	}
	.unit-body {
		padding: 20upx;
		display: flex;
		flex-wrap: wrap;

		// text {
		// 	width: 50%;
		// 	font-size: 28upx;
		// 	line-height: 55upx;
		// }
		.realname {
			width: 100%;
		}
	}
	.unit-foot {
		height: 88upx;
		padding: 0 20upx;
		border-top: 2upx solid #f5f5f5;
		border-bottom: none;
		line-height: 88upx;

		.btn {
			height: 60upx;
			font-size: 28upx;
			line-height: 60upx;
			margin: 14upx 4upx;
		}
	}
}
.toBottom {
	text-align: center;
	line-height: 50upx;
	margin-bottom: 50upx;
}
.total {
	position: fixed;
	text-align: center;
	width: 100%;
	height: 50upx;
	background-color: rgba(0, 0, 0, 0.1);
	bottom: 0px;
	line-height: 50upx;
	font-size: 32upx;
}
.success {
	// display: inline-block;
	height: 32px;
	padding: 0 10px;
	line-height: 30px;
	font-size: 12px;
	color: #409eff;
	border: 1px solid #d9ecff;
	border-top-color: rgb(217, 236, 255);
	border-right-color: rgb(217, 236, 255);
	border-bottom-color: rgb(217, 236, 255);
	border-left-color: rgb(217, 236, 255);
	border-radius: 4px;
	box-sizing: border-box;
	white-space: nowrap;
	background-color: #e7faf0;
	border-color: #d0f5e0;
	color: #13ce66;
}
button.success {
	background: #13ce66;
	color: #ffffff;
	border: unset;
}
button {
	margin: 4upx;
}
.danger {
	display: inline-block;
	height: 32px;
	padding: 0 10px;
	line-height: 30px;
	font-size: 12px;
	color: #409eff;
	border: 1px solid #d9ecff;
	border-top-color: rgb(217, 236, 255);
	border-right-color: rgb(217, 236, 255);
	border-bottom-color: rgb(217, 236, 255);
	border-left-color: rgb(217, 236, 255);
	border-radius: 4px;
	box-sizing: border-box;
	white-space: nowrap;
	background-color: #fef0f0;
	border-color: #fde2e2;
	color: #f56c6c;
}
/* #ifdef MP-TOUTIAO */
@font-face {
	font-family: uniicons;
	font-weight: normal;
	font-style: normal;
	src: url('~@/static/uni.ttf') format('truetype');
}

/* #endif */

/* #ifndef APP-NVUE */
page {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	background-color: #efeff4;
	min-height: 100%;
	height: auto;
}

view {
	font-size: 14px;
	line-height: inherit;
}

.example {
	padding: 0 15px 15px;
}

.example-info {
	padding: 15px;
	color: #3b4144;
	background: #ffffff;
}

.example-body {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	padding: 0;
	font-size: 14px;
	background-color: #ffffff;
}

/* #endif */
.example {
	padding: 0 15px;
}

.example-info {
	/* #ifndef APP-NVUE */
	display: block;
	/* #endif */
	padding: 15px;
	color: #3b4144;
	background-color: #ffffff;
	font-size: 14px;
	line-height: 20px;
}

.example-info-text {
	font-size: 14px;
	line-height: 20px;
	color: #3b4144;
}

.example-body {
	flex-direction: column;
	padding: 15px;
	background-color: #ffffff;
}

.word-btn-white {
	font-size: 18px;
	color: #ffffff;
}

.word-btn {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	align-items: center;
	justify-content: center;
	border-radius: 6px;
	height: 48px;
	margin: 15px;
	background-color: #007aff;
}

.word-btn--hover {
	background-color: #4ca2ff;
}

.example-body {
	/* #ifndef APP-NVUE */
	display: block;
	/* #endif */
	padding: 5px 15px;
}

.popup-content {
	background-color: #fff;
	padding: 15px;
}

/* #ifndef APP-NVUE */
.button {
	margin: 0;
	padding: 0;
	line-height: 1;
}

/* #endif */

.button {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	align-items: center;
	justify-content: center;
	flex: 1;
	height: 40px;
	margin: 0 15px;
}

.button-text {
	color: #fff;
	font-size: 14px;
}

.message {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	justify-content: center;
	padding: 15px 0;
}

.dialog {
	padding: 15px 0;
}

.dialog-box {
	margin-left: 15px;
	margin-bottom: 15px;
}

.dialog-text {
	font-size: 14px;
	color: #666;
}

.share {
	padding: 15px 0;
}

.popup__success {
	color: #fff;
	background-color: #4cd964;
}

.popup__warn {
	color: #fff;
	background-color: #f0ad4e;
}

.popup__error {
	color: #fff;
	background-color: #dd524d;
}

.popup__info {
	color: #fff;
	background-color: #909399;
}
</style>
